
<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
		<script src="../js/vue.min.js"></script>
		<script src="../js/vant.min.js"></script>
		<link rel="stylesheet" href="../css/index.css" />
		<script src="../js/ajax.js"></script>
		<script src="html5plus://ready"></script>
		<script src="../js/listener_other.js"></script>
		<title>个人资料</title>
	</head>
	<body>
		<div id="app">
			<van-row style="background-color:orangered; height:100px;line-height:46px;padding-top: 4%;">
			  <van-col span="4" offset="1" ><van-icon color="white" name="arrow-left" size="20px" style="margin-top: 29px;" @click="onClickLeft"/></van-col>
			  <van-col span="8" offset="3"><h2 style="color:white" >我的订单</h2></van-col>
			</van-row>
			<span id="imgtou" style="margin-left: 5%;"  >
				
				<span style="color: #7D7E80;size:45px;margin-top: 30px;" v-model="shuju">
					{{shuju}}
				</span>
			</span>
			<span id="img" v-for="n in vm.Data" >
				<van-row style="margin-top: 3%;margin-top: 5%; ">
							  
							  <van-col span="6" offset="2">订单编号</van-col>
							   <van-col span="5" offset="11" ><Span style="color: red;">n.StatusName</Span></van-col>
							</van-row>
							<van-card
							  num="2"
							  price="15.00"
							  desc="纯天然琥珀，凝聚大自然的魅力"  
							  title="枯叶绿叶琥珀"
							  thumb="../img/2012031220134655.jpg"
							  origin-price="45.00"
							>
							
							<Span style="color: red;">未支付</Span>
				  <div slot="footer">
				  	
				    <van-button type="danger" @click="onSubmit" >支付</van-button>
				   <van-button type="default" @click="defaults">取消订单</van-button>
				   
				  </div>
				</van-card>
			</span>
			
			 
			

		</div>
		<script type="text/javascript">
			ajax({
				url:"http://dsapi.ysd3g.com/api/MyOrderList",
				dataType:"jsonp",
				data:{
					
					key:localStorage.getItem("key")
				},
				success:function(res){
					console.log(res.Data.length);
					if(res.Data.length==0){
						vm.shuju="您还没有订单信息";
						document.getElementById("img").style.display="none";
						document.getElementById("imgtou").style.display="block";	
						
					}else{
							for(var i=0;i<res.Data.length;i++){
								if(res.Data[i].IsDefault){
									vm.chosenAddressId=res.Data[i].id;
									console.log(res.Data[i].name);
								}
								vm.Data.push(res.Data[i]);
								
								
							}	;
							document.getElementById("img").style.display="block";
							document.getElementById("imgtou").style.display="none";
					}
						
				}
			})
			var vm = new Vue({

				el: "#app",

				data: {
					data:[],
					zhuangtai:"",
					shuju:"",
					id:""
				},
				mounted(){
					if(localStorage.getItem("Error")==false||localStorage.getItem("Error")=="false"){
						
						
					
						document.getElementById("img").style.display="none";
						document.getElementById("imgtou").style.display="block";	
						
						
						
					}else{
						
						
					}
					if(localStorage.getItem("key")=="null"){
						alert("您未登录");
						plus.webview.open("../personcenter/denglu.html","denglu");
					}else{
						
					}
				},
				methods: {
					onSubmit:function(){
						plus.webview.open("../shopknow/jiesuan.html","jiesuan");
					},
					onClickLeft: function() {
						plus.webview.close(plus.webview.currentWebview().id);
					},
					defaults:function(){
						ajax({
							url:"http://dsapi.ysd3g.com/api/DeleteOrder",
							dataType:"jsonp",
							data:{
								
								key:localStorage.getItem("key"),
								oId: vm.id
							},
							success:function(res){
								console.log(res);
								
									
							}
						})
					}
				}

			});
		</script>
	</body>
</html>
